{extends file="template.tpl"}
{* STYLE SHEETS *}
{block name=css}<link rel="stylesheet" href="css/general.css" type="text/css" />
<link rel="stylesheet" href="css/admin.css" type="text/css" />
<script type="text/javascript" src="dtree/dtree.js"></script>{/block}

{* LEFT MENU *}
{block name=leftMenu}
    {include file="../snippets/left_menu.tpl"}
{/block}

{* CONTENT *}
{block name=content}
                <h1>Categorieën beheren</h1>
                <form method="POST" action="admin.php?option=manage_categories" id="manageCategories">
                <script type="text/javascript">
                    manageCategoryTree = new dTree('manageCategoryTree');
                    manageCategoryTree.config.useLines = false;
                    manageCategoryTree.config.useIcons = false;
                    manageCategoryTree.add(0,-1,'Hoofdcategorie');
                    manageCategoryTree.shouldUpdateForm = true;
                    {foreach $categories as $category}
                        manageCategoryTree.add( {$category->id}, {$category->parentid}, "{$category->name}"{if isset($category->sectionid)}, "{$sections[$category->sectionid]->name}"{/if});
                    {/foreach}
                    document.write(manageCategoryTree);
                </script>
                <p>Geselecteerde categorie: {validate id="fCategoryChoice" message="<span class='newArticleError' style='padding-left:50px;' >Selecteer een geldige categorie</span>"}<br />
                <input id="nodeNameSelection" type="text" style="width:100%;" disabled="true" /></p>
                <p>Operatie: {validate id="fOperation" message="<span class='newArticleError' style='padding-left:50px;' >Kies een operatie</span>"}<br />
                <input id="addOption" type="radio" name="operation" value="add" {if $operation eq 'add'}checked{/if}>Subcategorie toevoegen</input>
                <input type="radio" name="operation" value="rename" {if $operation eq 'rename'}checked{/if}>Categorie hernoemen</input>
                <input type="radio" name="operation" value="delete" {if $operation eq 'delete'}checked{/if}>Categorie verwijderen</input>
                <input id="assignOption" type="radio" name="operation" value="assign" {if $operation eq 'assign'}checked{/if}>Toewijzen aan sectie:</input>
                <select id="sectionSelection" name="assignedSection">
                    {foreach $sections as $section}
                        <option value="{$section->id}">{$section->name}</option>
                    {/foreach}
                </select> </p>
                <input type="radio" name="operation" value="moveUp" {if $operation eq 'moveUp'}checked{/if}>Omhoog verplaatsen</input>
                <input type="radio" name="operation" value="moveDown" {if $operation eq 'moveDown'}checked{/if}>Omlaag verplaatsen</input>
                <input id="nodeIdSelection" type="hidden" name="categoryId" value="0" />
                <p>Categorienaam: {validate id="fNewName" message="<span class='newArticleError' style='padding-left:50px;' >Categorienaam mag niet leeg zijn</span>"}
                    <input type="text" name="categoryName" style="width:100%;" value="{$categoryName}"/></p>
                <input type="submit" value="Uitvoeren" />
                
                </form>
                    
                <script type="text/javascript">
                updateElement(document.getElementById('nodeIdSelection'), manageCategoryTree.aNodes[manageCategoryTree.selectedNode].id);
                updateElement(document.getElementById('nodeNameSelection'), manageCategoryTree.aNodes[manageCategoryTree.selectedNode].name);
                updateForm(manageCategoryTree.aNodes[manageCategoryTree.selectedNode].pid);
                </script>
{/block}